<template>
	<view >
		<view class="Topbg">
			<view class="info">
				<view class="u-flex">
					<u-image :src="info.avter" width="80" height="80" shape="circle"></u-image>
					<view class="u-margin-left-20">
						<view >
							<view style="color: #FFFFFF;font-size: 34rpx;">{{info.name}}</view>
							<u-image :src="info.dengji" width="105" height="53" v-if="info.dengji"></u-image>
						</view>
					</view>
				</view>


				<view style="text-align: center;color: #FFFFFF;" >
					<view style="font-size: 40rpx;margin-bottom: 20rpx;">￥{{info.allprice}}</view>
					<view>累计分销</view>
				</view>
			</view>

		</view>


		<view class="move">
			
			<view class="mode">
                <view class="u-flex " style="justify-content: space-around;text-align: center;">
                   <view @click="dirman">
					   <view class="" style="font-size: 40rpx;">
					   	   {{info.dirman}}
					   </view>
					   <view>
						   直邀好友
						   <u-icon name="arrow-right"></u-icon>
					   </view>
				   </view>	
				   <view>
					   <view class="" style="font-size: 40rpx;">
						   {{info.kuosanman}}
					   </view>
					   <view>
						   扩散人数
						
					   </view>
				   </view>	
                </view>
			</view>

			<view style="width:690rpx ;margin:40rpx auto;position: relative;">
				<!-- <button open-type="share" hover-class='none' class="custom-btn">默认按钮</button> -->
				<u-image :src="imagesurl+'/images/banner_2.png'" width="690" height="250" @click="go"></u-image>
			</view>


			<view class="mode">
				<view style="margin:auto;width: 140rpx;">
					<u-image src="/static/fenxiaotitle.png" width="140" height="60"></u-image>
				</view>

				<view v-for="(item,index) in list" :key="index" class="List u-flex u-border-bottom u-padding-20">
					<view :class="Number(item.number)<0?'tred':'tblue'">￥{{item.number}}</view>

					<view>
						<view>{{item.remark}}</view>
						<view style="color: #999;font-size: 20rpx;margin-top: 10rpx;">{{item.createTime}}</view>
					</view>
				</view>
				<u-loadmore :status="status" />
			</view>
		</view>

	</view>
</template>

<script>
	import url from '@/common/baseUrl.js';

	export default {

		data() {
			return {
				imagesurl: url.imageUrl,
				info: {
					avter: "",
					name: "",
					dengji: "",
					allprice: "",
					dirman:"",
					kuosanman:""
				},

				status: 'loadmore',
				page: 1,
				list: []

			}
		},
		methods: {
			fenxiao(){
			console.log(111)
			},
			dirman(){
				uni.navigateTo({
					url:"./dirfriends"
				})
			},
			information(){
				this.$u.post('/api/user/information', {
					
				}, {}).then(res => {
				    var {headimg,levelId,nickname}=res.data;
				    this.info.avter=headimg;
				    this.info.name=nickname;
				    			   
				    if(levelId==1){
				    this.info.dengji="/static/degree_1.png"
				    }
				    if(levelId==2){
				    this.info.dengji="/static/degree_2.png"
				    }
				    if(levelId==3){
				    this.info.dengji="/static/degree_3.png"
				    }
				    if(levelId==0){
				     this.info.dengji=""
				    }
							
				}).catch(err => {})
			},
			zijin(){
				this.$u.post('/api/Financial/info', {
					
				}, {}).then(res => {
					var {totalCommission,totalOne,totalTwo}=res.data;
				    this.info.allprice=totalCommission
				    this.info.dirman=totalOne,
				    this.info.kuosanman=totalTwo
				    
				}).catch(err => {})
			
			},
			record(){
				this.$u.post('/api/Financial/commission', {
					
				}, {}).then(res => {
					  var resList = res.data;
					  if (this.page == 1) {
					  	this.list = []
					  }
					  if (resList.length > 9) {
					  	this.status = 'loadmore'
					  	this.page = this.page + 1
					  } else {
					  	this.status = 'nomore'
					  }
					  this.list = this.list.concat(resList)
					  this.loading = false
					  						 
				}).catch(err => {})
				
			},
			go(){
				uni.navigateTo({
					url:"post"
				})
			}
		},
		onLoad() {
			this.information()
			this.zijin()
			this.record()
		},
		onReachBottom() {
			if (this.status == 'nomore') {
		
			} else {
				this.jiazai()
			}
		
		},
	}
</script>

<style lang="scss">
	@import '../../pages/my/common.css';

	.Topbg {
		height: 300rpx;
		background: #628DFF;

		border-radius: 0rpx 0rpx 50% 50%;
		display: inline-block;
		width: 750rpx;

	}

	.info {
		display: flex;
		padding: 40rpx;
		justify-content: space-between;
	}

	.move {
		position: relative;
		bottom: 120rpx;
	}

	.classList {

		background: #FFFFFF;
		width: 690rpx;
		height: 200rpx;
		background: #FFFFFF;
		box-shadow: 0px 4rpx 6rpx rgba(209, 209, 209, 0.25);
		border-radius: 40rpx;
		left: 30rpx;
		margin: auto;

	}
	
</style>
